import 'package:flutter/material.dart';
import 'package:flutter_vant/component/actionSheet.dart';
import 'package:flutter_vant/main.dart';
import 'package:simulator/components/DemoView/index.dart';

class ActionSheetView extends HookWidget {
  const ActionSheetView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    openAction(Map item) {
      VanActionSheet.show(
          context: context,
          option: VanActionSheetOption(
              cancelText: item['cancelText'],
              description: item['description'],
              actions: (item['data'] as List)
                  .map((e) => VanActionSheetAction(
                      color: e['color'],
                      name: e['name'],
                      subname: e['subname'],
                      loading: e['loading'],
                      disabled: e['disabled']))
                  .toList()));
    }

    List<Widget> renderList(List<Map> data) {
      return data.map((e) {
        return DemoView(title: e['name'], isGrid: false, children: [
          VanCellGroup(
              children: (e['children'] as List).map((el) {
            return VanCell(
              title: el['name'],
              onClick: () => openAction(el),
            );
          }).toList())
        ]);
      }).toList();
    }

    List<Widget> renderMain() {
      final List<Map> data = [
        {
          "name": "基础用法",
          "children": [
            {
              "name": "基础用法",
              "data": List.generate(
                  3, (index) => ({"name": '选项' + index.toString()}))
            },
            {
              "name": "展示取消按钮",
              "data": List.generate(
                  3, (index) => ({"name": '选项' + index.toString()})),
              'cancelText': '取消'
            },
            {
              "name": "展示描述信息",
              "description": '这是一段描述信息',
              "data": List.generate(
                  3,
                  (index) =>
                      ({"name": '选项' + index.toString(), "subname": "描述信息"})),
              'cancelText': '取消'
            },
          ]
        },
        {
          "name": "选项状态",
          "children": [
            {
              "name": '选项状态',
              "data": [
                {"name": '着色选项', "color": '#ee0a24'},
                {"name": '禁用选项', "disabled": true},
                {"name": '加载选项', "loading": true},
              ]
            }
          ]
        },
      ];
      return renderList(data);
    }

    return HookView(title: 'ActionSheet', children: renderMain());
  }
}
